import React from 'react';
import { Menu} from 'antd';
import { NavLink } from 'react-router-dom'
import menuList from '../../config/config.jsx'
const SubMenu = Menu.SubMenu;


class NavLeft extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      menuList : menuList,
      mode: "inline"
    }
  }
  render() {
    let data = this.state.menuList;
    return (
      <div>
        <Menu mode={this.state.mode}>     
            { data.map((item) => {
                if (item.children) {
                  return (
                    <SubMenu title={item.title} key={item.key}>
                      {
                        item.children.map(children=>{
                          return(
                            <Menu.Item title={children.title} key={children.key}>
                             <NavLink to={{ pathname: `/home/${children.title}`, state: {keyword: children.title} }}>{children.title}</NavLink>
                            </Menu.Item>
                          )
                        })
                      }
                    </SubMenu>
                  )
                }else{
                  if(item.title ==='首页'){
                    return(
                      <Menu.Item title={item.title} key={item.key}>
                       <NavLink to={{ pathname: `/`}}>{item.title}</NavLink>
                      </Menu.Item>
                    )
                  }else{
                    return(
                      <Menu.Item title={item.title} key={item.key}>
                        <NavLink to={{ pathname: `/home/${item.title}`, state: {keyword: item.title} }}>{item.title}</NavLink>
                      </Menu.Item>
                    )
                  }
                }     
              })
            }
        </Menu>
      </div>
    )
  }
}
export default NavLeft;
